<script>
import {createProps} from '@/utils';
import BaseButton from '@comp/hhd/design/FormMenu/button/base/BaseButton.vue';
import {createFormDefinition} from '@comp/hhd/design/FormDesigner/types';
import {postAction} from '@api/manage';

export default {
  name: 'BatchRemoveButton',
  props: {
    formDefinition: createProps(Object, createFormDefinition),
    selectedRows: createProps(Array, () => []),
    config: createProps(Object, () => ({})),
    button: createProps(Object, () => ({})),
  },
  render(h) {
    return h(BaseButton, {
      props: {
        disabled: this.disabled,
        config: this.config,
        selectedRows: [],
      },
      on: {
        click: () => this.handleClick(),
      }
    });
  },
  methods: {
    removeData() {
      postAction('/form/formMenu/batchRemove', {
        formDefinitionId: this.formDefinition.id,
        formDataId: this.selectedRows.map(item => item.id),
      }).then(() => {
        this.$message.success('删除成功');
        this.$emit('reload');
      });
    },
    handleClick() {
      this.$confirm({
        title: '确认删除',
        content: '是否删除选中数据?',
        onOk: () => {
          this.removeData();
        }
      });
    },
  },
  computed: {
    disabled() {
      return !this.selectedRows || !this.selectedRows.length;

    },
  }
};
</script>